<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<body class="hold-transition skin-blue sidebar-mini">

<div class="modal fade" data-backdrop="static" data-keyboard="false" id="modal-show-daily">
    <div class="modal-dialog" style="width:1350px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">查看&nbsp;&nbsp;&nbsp;&nbsp;<span id="projectInfo" style="font-size: 15px"></span>
                </h4>
            </div>
            <div class="modal-body">
                <form id="queryDailyForm">
                    <div class="row">
                        <div class="form-inline">
                            <div class="form-group" style="margin-right: 10px;margin-left: 10px;">
                                <label>名称</label>
                                <input type="text" id="projectCode" name="projectCode" class="form-control"
                                       placeholder="请输入项目名称或代码" autocomplete="off">
                            </div>
                            <div class="form-group" style="margin-right: 10px;margin-left: 10px;">
                                <label>订单号</label>
                                <input type="text" id="orderNum" name="orderNum" class="form-control"
                                       placeholder="请输入订单号" autocomplete="off">
                            </div>
                            <div class="form-group" style="margin-right: 10px;margin-left: 10px;">
                                <label>厂名</label>
                                <select id="factoryIdQuery" class="form-control" name="factoryId" title="">
                                    <option value="" selected="selected">请选择</option>
                                    <option th:each="factory:${factories}" th:value="${factory.id}"
                                            th:text="${factory.name}"></option>
                                </select>
                            </div>
                            <div class="form-group" style="margin-right: 10px;">
                                <label>日期</label>
                                <input type="text" class="form-control datepicker" name="inputTime"
                                       readonly="readonly"/>
                            </div>
                            <button type="button" class="btn btn-success" id="btn-searchDaily">
                                <!--<i class="fa fa-search"></i>-->
                                <span class="Bold">搜索</span>
                            </button>
                        </div>
                    </div>
                </form>
                <table id="bootstrap-table1"></table>
            </div>


        </div>
    </div>
</div>

<div class="modal fade" data-backdrop="static" data-keyboard="false" id="modal-create-daily">
    <div class="modal-dialog" style="width:800px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">日报信息</h4>
            </div>
            <div class="modal-body">
                <form id="dailyForm" class="form-horizontal">
                    <input type="hidden" id="projectId" name="projectId">
                    <input type="hidden" name="id" id="id">
                    <div class="row">
                        <div class="col-md-12">
                            <h4 id="name" style="margin-left: 20px;margin-bottom: 20px"></h4>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">生产厂</label>
                                <div class="col-sm-7">
                                    <select id="factoryId" class="form-control" name="factoryId" title="">
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">日期</label>
                                <div class="col-sm-7">
                                    <input type="text" class="form-control datepicker" name="inputTime" placeholder=""
                                           readonly>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">自动生产焊接(件)</label>
                                <div class="col-sm-7">
                                    <input type="number" class="form-control" name="autoWeldNum" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6 weight">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">自动生产焊接(吨)</label>
                                <div class="col-sm-7">
                                    <input type="text" class="form-control" name="autoWeldWeight" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">手动生产焊接(件)</label>
                                <div class="col-sm-7">
                                    <input type="number" class="form-control" name="manualWeldNum" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6 weight">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">手动生产焊接(吨)</label>
                                <div class="col-sm-7">
                                    <input type="text" class="form-control" name="manualWeldWeight" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">生产非焊接(件)</label>
                                <div class="col-sm-7">
                                    <input type="number" class="form-control" name="noWeldNum" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6 weight">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">生产非焊接(吨)</label>
                                <div class="col-sm-7">
                                    <input type="text" class="form-control" name="noWeldWeight" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="col-sm-5 control-label">转储(件)</label>
                                <div class="col-sm-7">
                                    <input type="number" class="form-control" name="storeNum" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group weight">
                                <label class="col-sm-5 control-label">转储(吨)</label>
                                <div class="col-sm-7">
                                    <input type="text" class="form-control" name="storeWeight" placeholder="">
                                </div>
                            </div>
                        </div>
                        <div class="col-md-12">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">备注</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" name="remark" placeholder="">
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-info" id="btn-create-daily">保存</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>

<section class="content-header">
    <h1>日报表维护</h1>
</section>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <form id="queryForm">
                        <div class="row">
                            <div class="form-inline">
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>名称</label>
                                    <input type="text" name="name" class="form-control" placeholder="请输入项目名称或订单号或代码">
                                </div>
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>数量</label>
                                    <input type="text" name="num" class="form-control" placeholder="请输入数量">
                                </div>
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>生产厂</label>
                                    <select name="factories" class="form-control">
                                        <option value="" selected="selected">请选择</option>
                                        <option th:each="factory:${factories}" th:value="${factory.name}"
                                                th:text="${factory.name}"></option>
                                    </select>
                                </div>
                                <div class="form-group" style="margin-right: 10px;">
                                    <label>状态</label>
                                    <select name="status" class="form-control">
                                        <option value="2" selected="selected">未完成</option>
                                        <option value="3">已完成</option>
                                    </select>
                                </div>
                                <button type="button" class="btn btn-success" id="btn-search">
                                    <!--<i class="fa fa-search"></i>-->
                                    <span class="Bold">搜索</span>
                                </button>
                                <a href="javascript:void(0);" class="btn btn-info pull-right"
                                   onclick="openDailyList('')" style="text-align: right">
                                    <!--<i class="fa fa-"></i>-->
                                    <span class="Bold">日报明细查询</span>
                                </a>

                            </div>
                        </div>
                    </form>
                </div>
                <div class="box-body">
                    <table id="bootstrap-table"></table>
                </div>
            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
    var table, table1;
    var gloorderType;
    /**
     * 打开项目对应日报表
     */
    function openDailyList(code, type) {
        gloorderType = type;
        if (type == 1) {
            $(".weight").hide();
        } else {
            $(".weight").show();
        }
        // 项目信息拼接
        $('#projectCode').val(code);

        table1 = js.table.init({
            id: "bootstrap-table1",
            queryForm: "queryDailyForm",
            url: ctx + "board/daily/projectDailyList",
            showExport:true,
            columns: [
                {
                    title: '序号', field: 'id', width: '40',
                    formatter: function (value, row, index, field) {
                        return index + 1;
                    }
                },
                {title: '订单号', field: 'projectCode', width: '80'},
                {title: '项目名称', field: 'projectName', width: '150'},
                {title: '厂名', field: 'factoryName', width: '118'},
                {title: '日期', field: 'inputTime', width: '100'},
                {
                    title: '分类', field: 'orderType', width: '80',
                    formatter: function (value, row, index) {
                        if (value === 1) {
                            return '体系楼';
                        } else if (value === 2) {
                            return '备库';
                        } else if (value === 3) {
                            return '财务';
                        }
                    }
                },
                {title: '自动生产<br>焊接(件)', field: 'autoWeldNum'},
                {title: '自动生产<br>焊接(吨)', field: 'autoWeldWeight',formatter: function (value, row, index) {
                        if(value != null){return value.toFixed(2);}else{return ''}
                    }},
                {title: '手动生产<br>焊接(件)', field: 'manualWeldNum'},
                {title: '手动生产<br>焊接(吨)', field: 'manualWeldWeight',formatter: function (value, row, index) {
                        if(value != null){return value.toFixed(2);}else{return ''}
                    }},
                {title: '生产非<br>焊接(件)', field: 'noWeldNum'},
                {title: '生产非<br>焊接(吨)', field: 'noWeldWeight',formatter: function (value, row, index) {
                        if(value != null){return value.toFixed(2);}else{return ''}
                    }},
                {title: '转储(件)', field: 'storeNum'},
                {title: '转储(吨)', field: 'storeWeight',formatter: function (value, row, index) {
                        if(value != null){return value.toFixed(2);}else{return ''}
                    }},
                {title: '备注', field: 'remark', width: '90'}
                ,
                {
                    title: '操作', width: '65',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-danger btn-xs" style="margin-bottom: 3px;" href="javascript:void(0)" onclick="delTaskDaily(' + row.id + ')">删除</a> ');
                        actions.push('<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="openEditDailyInputModal(' + row.id + ',\'' + row.projectId + '\')">编辑</a> ');
                        return actions.join('');
                    }
                }
            ]
        });
        js.modal.open("modal-show-daily");

    }
    /**
     * 删除日报
     */
    function delTaskDaily(id) {
        js.modal.confirm("确定删除此日报吗？", function (result) {
            js.post({
                url: ctx + "board/daily/del",
                data: {
                    id: id,
                    status: 0
                },
                success: function (result) {
                    if (result.type === web_status.SUCCESS) {
                        js.modal.success(result.msg);
                        js.table.refresh(table1);
                    } else {
                        js.modal.warning(result.msg);
                    }
                    js.modal.closeLoading();

                }
            })
        })
    }


    /**
     * 打开创建日报模态框
     */
    function openCreateDailyInputModal(id, name, orderType) {

        gloorderType = orderType;
        $("#projectId").val(id);
        $("#name").text(name);
        $("input[name='inputTime']").val(new Date().format('yyyy-MM-dd'));
        js.updateDatePicker();
        if (orderType == 1) {
            $(".weight").hide();
        } else {
            $(".weight").show();
        }
        js.post({
            url: ctx + "board/daily/taskFactory",
            data: {
                id: id
            },
            success: function (result) {
                $("#factoryId").empty().append('<option value="">请选择</option>');
                $.each(result, function (i, v) {
                    $("#factoryId").append('<option value="' + v.id + '">' + v.name + '</option>');
                });

                js.modal.open("modal-create-daily");
                js.modal.closeLoading();
            }
        });
    }

    /**
     * 获取数据
     */
    function getTaskDaily(id) {
        js.post({
            url: ctx + "board/daily/id",
            data: {
                id: id
            },
            success: function (result) {
                $("#dailyForm").fillData(result);
                js.modal.open("modal-create-daily");
                js.modal.closeLoading();
            }
        })
    }

    /**
     * 打开模态框同时根据ID查询并回显数据
     */
    function openEditDailyInputModal(id, projectId) {

        $("#name").text('');

        js.post({
            url: ctx + "board/daily/taskFactory",
            data: {
                id: projectId
            },
            success: function (result) {
                $("#factoryId").empty().append('<option value="">请选择</option>');
                $.each(result, function (i, v) {
                    $("#factoryId").append('<option value="' + v.id + '">' + v.name + '</option>');
                });
                getTaskDaily(id);
            }
        });
    }



    $(function () {

        /** 加载列表 */
        table = js.table.init({
            url: ctx + "board/daily/list",
            columns: [
                {
                    title: '序号', field: 'id', width: '40',
                    formatter: function (value, row, index, field) {
                        return index + 1;
                    }
                },
                {title: '项目名称', field: 'name', width: '200'},
                {title: '订单号', field: 'orderNum', width: '80'},
                {title: '代码', field: 'code', width: '80'},
                {title: '数量', field: 'num'},
                {title: '面积', field: 'area'},
                {title: '喷涂要求', field: 'spray', width: '70'},
                {
                    title: '是否拼装', field: 'assemble', width: '70',
                    formatter: function (value, row, index) {
                        if (value === 1) {
                            return '拼装';
                        } else if (value === 0) {
                            return '免拼装';
                        }
                    }
                },
                {
                    title: '生产厂', field: 'factories', width: '120',
                    formatter: function (value, row, index) {
                        if (value != null) {
                            return value.split(',').join('<br>');
                        }
                    }
                },
                {title: '设计文件<br>下发日期', field: 'designTime', width: '100'},
                {title: '备注', field: 'remark', width: '200'},
                {
                    title: '操作', width: '120',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-info btn-xs" href="javascript:void(0)" onclick="openDailyList(\'' + row.code + '\','+row.orderType+')"> 查看</a> ');
                        actions.push('<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="openCreateDailyInputModal(' + row.id + ',\'' + row.name + '\',' + row.orderType + ')"> 录入</a> ');
                        return actions.join('');
                    }
                }
            ]
        });

        /** 表格搜索 */
        $("#btn-search").click(function () {
            js.table.search(table);
        });

        /**
         * 初始化验证
         */
        js.validate.init("dailyForm", {
            fields: {
                factoryId: {validators: {notEmpty: {message: '请选择生产厂'},}}
            }
        });

        /**
         * 录入或编辑
         */
        $("#btn-create-daily").click(function () {
            var url = ctx + "board/daily/input";
            if ($("#id").val()) {
                url = ctx + "board/daily/update";
            }

            js.validSubmit({
                formId: "dailyForm",
                url: url,
                data: new FormData($("#dailyForm")[0]),
                success: function (result) {
                    if (result.type === web_status.SUCCESS) {
                        js.modal.success(result.msg);
                        if (table1) {
                            js.table.refresh(table1);
                        }
                        js.modal.hide("modal-create-daily");
                    } else {
                        js.modal.warning(result.msg);
                    }
                    js.modal.closeLoading();
                }
            });


        });

        /**
         * 模态框隐藏事件， 重置表单，重置验证
         */
        js.modal.hideEvent("modal-create-daily", function () {
            js.validate.reset("dailyForm");
            js.reset("dailyForm");
        });
        js.modal.hideEvent("modal-show-daily", function () {
            js.table.destroy(table1);
            js.reset("queryDailyForm");
        });

        /** 表格搜索 */
        $("#btn-searchDaily").click(function () {
            js.table.search(table1);
        });

        $("#factoryId").change(function () {
            if ($(this).val() == 5 && gloorderType == 1) {
                $(".weight").show();
            }
            if ($(this).val() != 5 && gloorderType == 1) {
                $(".weight").hide();
            }
        })
    });
</script>
</body>
</html>
